<script setup>
	const props=defineProps({
		info:Object
	})
	// 患病时长
	const illnessTimes = {
	  1: '一周内',
	  2: '一个月内',
	  3: '半年内',
	  4: '半年以上'
	}
	// 是否就诊过
	const consultFlags = {
	  1: '就诊过',
	  0: '没有就诊过'
	}
	
	//预览图片
	const onPreviewImg=(picture)=>{
	   uni.previewImage({
		   urls:picture.map(v=>v.url)
	})
	}
</script>
<template>
  <!-- 患者信息（21） -->
  <view class="patient-info">
    <view class="header">
      <view class="title">{{props.info.patientInfo.name}} {{props.info.patientInfo.genderValue}} {{props.info.patientInfo.age}}岁</view>
      <view class="note">{{illnessTimes[props.info.patientInfo.illnessTime]}} | {{consultFlags[props.info.patientInfo.consultFlag]}}</view>
    </view>
    <view class="content">
      <view class="list-item">
        <text class="label">病情描述</text>
        <text class="note">{{props.info.patientInfo.illnessDesc}}</text>
      </view>
      <view class="list-item">
        <text class="label">图片</text>
        <text v-if="props.info.pictures?.length" class="note" @click="onPreviewImg(props.info.pictures)">点击查看</text>
				<text v-else class="note">暂无图片</text>
      </view>
    </view>
  </view>
</template>

<style lang="scss">
.patient-info {
  padding: 30rpx;
  margin-top: 60rpx;
  border-radius: 20rpx;
  box-sizing: border-box;
  background-color: #fff;

  .header {
    padding-bottom: 20rpx;
    border-bottom: 1rpx solid #ededed;

    .title {
      font-size: 32rpx;
      color: #121826;
      margin-bottom: 10rpx;
    }

    .note {
      font-size: 26rpx;
      color: #848484;
    }
  }

  .content {
    margin-top: 20rpx;
    font-size: 26rpx;

    .list-item {
      display: flex;
      margin-top: 10rpx;
    }

    .label {
      width: 130rpx;
      color: #3c3e42;
    }

    .note {
      flex: 1;
      line-height: 1.4;
      color: #848484;
    }
  }
}
</style>